<style lang="stylus" scoped>
  .invitation
    .container
      padding-top: 4rem;
      box-sizing: border-box;
      .invitation-box
        width: 80%;
        margin: 3rem 10%;
        border: .1rem solid #eecf7a;
        border-radius: .5rem;
        box-sizing: border-box;
        color: #fff;
        .invitation-code
          padding: 1.5rem 1rem;
        p
          display: block;
          width: 100%;
          text-align: center;
          font-size: 1.5rem;
        span 
          display: block;
          width: 100%;
          text-align: center;
          font-size: 4rem;
      .share-btn
        width: 100%;
        margin: 1rem 0 2rem 0;
        box-sizing: border-box;
        padding: 1rem;
        background-color: #fff;
        display: flex;
        align-items: center;
        justify-content: space-around;
        p
          font-size: 1.3rem;
        a  
          width: 10%;
        img 
          width: 100%;
      .invitation-tip
        margin-top: 3.2rem;
        margin-bottom: 1.8rem;
        width: 100%;
        text-align: center;
        font-size: 1.4rem;
        color: #fff;
      .invitation-text
        width: 100%;
        height: auto;
        box-sizing: border-box;
        padding: 0 1.25rem;
        border-bottom: .1rem solid #c3ad6f;
        border-top: .1rem solid #c3ad6f;
        .invitation-item
          display: flex;
          justify-content: space-between;
          align-items: center;
          box-sizing: border-box;
          width: 100%;
          padding: 1rem .25rem;
          color: #fff;
          font-size: 1.1rem;
          &:first-of-type
            border-bottom: .1rem solid #706547;
</style>

<template>
  <div class="invitation">
    <navTop :title="title"></navTop>
    <div class="container">
			<div class="invitation-box">
				<div class="invitation-code">
					<p>邀请码</p>
					<span>10257</span>
				</div>
			</div>
			<div class="share-btn">
				<p>分享</p>
				<a class="ico-wx"><img src="../assets/ico-wx.png"></a>
				<a class="ico-qq"><img src="../assets/ico-qq.png"></a>
				<a class="ico-facebook"><img src="../assets/ico-facebook.png"></a>
				<a class="ico-twitter"><img src="../assets/ico-twitter.png"></a>
			</div>
			<div class="invitation-tip">每邀请一个用户，获得10GTBC</div>
			<div class="invitation-text">
				<div class="invitation-item invitation-num">
					<p>邀请人数</p>
					<span>0人</span>
				</div>
				<div class="invitation-item invitation-income">
					<p>获取GTBC</p>
					<span>0GTBC</span>
				</div>
			</div>
		</div>
  </div>
</template>

<script>
import navTop from '../components/navTop'
export default {
  data(){
    return {
      title:"邀请注册"
    }
  },
  components:{
    navTop,
  },
  methods:{
    href(){
      this.$router.back()
    },
  }
}
</script>
